
<%@include file="/WebPages/Includes/header.jsp"%>
<%@include file="/WebPages/Includes/startBody.jsp"%>
<%@include file="/WebPages/Includes/tablesorter.jsp"%>
<%@include file="/WebPages/Includes/navbar.jsp"%>
<%@include file="/WebPages/Includes/startMainContent.jsp"%>
<%@include file="/WebPages/Includes/leftSidebar.jsp"%>

<div class="col-lg-8 col-md-8 col-xs-12 col-sm-9"><hr>

	<button class="btn btn-primary btn-lg" data-target="#myInsertModal"
		data-toggle="modal">Create Moderator</button>

	<button class="btn btn-danger btn-lg" data-target="#myConfirmModal"
		data-toggle="modal" id="deleteSelectedRows">Delete Selected</button>
		
	<hr>

	<div class="table-responsive" style="overflow-x:auto; overflow-y:auto;" id="tableDiv">
	</div>

	<!-- Insert Modal -->
	<div aria-hidden="true" aria-labelledby="myInsertModalLabel"
		class="modal fade" id="myInsertModal" role="dialog" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button aria-hidden="true" class="close" data-dismiss="modal"
						type="button">&times;</button>
					<h4 class="modal-title" id="myInsertModalLabel">Create Moderator</h4>
				</div>
				<div class="modal-body">
					<form id="insertForm" method="post" name="insertForm" role="form">
						<script type="text/javascript">
							$(document)
									.ready(
											function() {
												var elements = [ [] ];
												elements = [[ "mdrFname",
																"mdrFname",
																"Teacher Firstname",
																false, false ],
														[
																"mdrNmane",
																"mdrNmane",
																"Middle Name",
																false, false ],
																[
																	"mdrLname",
																	"mdrLname",
																	"Last Name",
																	false, false ],
																	[
																		"mdrAddress",
																		"mdrAddress",
																		"Address",
																		false, false ],
																		[
																			"mdrCity",
																			"mdrCity",
																			"City",
																			false, false ],
																			[
																				"mdrState",
																				"mdrState",
																				"State",
																				false, false ],
																				[
																					"mdrCountry",
																					"mdrCountry",
																					"Country",
																					false, false ],
																					[
																						"mdrPin",
																						"mdrPin",
																						"Pin",
																						false, false ],
																						[
																							"mdrEmail",
																							"mdrEmail",
																							"Email",
																							false, false ]];
												var toAppend = createFormGroupDivs(elements);
												$(toAppend)
														.insertBefore(
																"form#insertForm .modal-footer");
											});
						</script>
						<div class="modal-footer">
							<button class="btn btn-default" data-dismiss="modal"
								type="button">Close</button>
							<button class="btn btn-primary" id="insertModerator"
								type="button">Create Moderator</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>


	<!-- Update Modal -->
	<div aria-hidden="true" aria-labelledby="myModalLabel"
		class="modal fade" id="myUpdateModal" role="dialog" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button aria-hidden="true" class="close" data-dismiss="modal"
						type="button">&times;</button>
					<h4 class="modal-title" id="myModalLabel">Update Moderator</h4>
				</div>
				<div class="modal-body">
					<form id="updateForm" method="post">
						<script type="text/javascript">
							$(document)
									.ready(
											function() {
												var elements = [ [] ];
												elements = [[ "umdrFname",
																"mdrFname",
																"Firstname",
																false, false ],
														[
																"umdrNmane",
																"mdrNmane",
																"Middle Name",
																false, false ],
																[
																	"umdrLname",
																	"mdrLname",
																	"Last Name",
																	false, false ],
																	[
																		"umdrAddress",
																		"mdrAddress",
																		"Address",
																		false, false ],
																		[
																			"umdrCity",
																			"mdrCity",
																			"City",
																			false, false ],
																			[
																				"umdrState",
																				"mdrState",
																				"State",
																				false, false ],
																				[
																					"umdrCountry",
																					"mdrCountry",
																					"Country",
																					false, false ],
																					[
																						"umdrPin",
																						"mdrPin",
																						"Pin",
																						false, false ],
																						[
																							"umdrEmail",
																							"mdrEmail",
																							"Email",
																							false, false ],
																							[
																								"ucreatedBy",
																								"createdBy",
																								"Created By",
																								true, true ],
																								[
																									"ucreatedDate",
																									"createdDate",
																									"Created Date",
																									true, true ]];
												var toAppend = createFormGroupDivs(elements);
												$(toAppend)
														.insertBefore(
																"form#updateForm .modal-footer");
											});
						</script>
						<div class="modal-footer">
							<button class="btn btn-default" data-dismiss="modal"
								type="button">Close</button>
							<button class="btn btn-primary" id="updateModerator"
								type="button">Save changes</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>


	<!-- Confirm Modal -->
	<div aria-hidden="true" aria-labelledby="myConfirmModalLabel"
		class="modal fade" id="myConfirmModal" role="dialog" tabindex="-1">
		<div class="modal-dialog">
			<div align="center" class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title" id="myConfirmModalLabel">Are you sure?</h4>
				</div>
				<div class="modal-body">
					<button class="btn btn-danger" id="confirmDelete" type="submit">Yes</button>
					<button class="btn btn-primary" id="cancelDelete" type="submit">No</button>
				</div>
			</div>
		</div>
	</div>
</div>

<%@include file="/WebPages/Includes/rightSidebar.jsp"%>
<%@include file="/WebPages/Includes/endMainContent.jsp"%>
<%@include file="/WebPages/Includes/footer.jsp"%>

<!-- custom scripts here -->
<script src="./../../customJS/Admin/adminModeratorHome.js"></script>

<%@include file="/WebPages/Includes/endBody.jsp"%>